package controls
{
  import flash.display.Graphics;
  
  import mx.containers.Canvas;
  import mx.controls.Image;
  import mx.core.UIComponent;
  
  /**
   * 	LoadCanvas displays a loading indicator when isLoading is set to true
   */
  public class ScaledLoadCanvas extends Canvas
  {
    
    //--------------------------------------------------------------------------
    //
    //  Constructor
    //
    //--------------------------------------------------------------------------
    
    /**
     *  Constructor.
     */
    public function ScaledLoadCanvas()
    {
      super();
    }
    
    //--------------------------------------------------------------------------
    //
    //  Variables
    //
    //--------------------------------------------------------------------------
    
    /**
     * 	@private
     * 	Image that is displayed when loading
     */
    private var _loadImage:Image;
    
    /**
     * 	@private
     * 	Sits on top of the contents when loading
     * 	to create a disabled look
     */
    private var _fade:UIComponent;
    
    //--------------------------------------------------------------------------
    //
    //  Properties
    //
    //--------------------------------------------------------------------------
    
    /**
     * 	Set isLoading to true when contents of this Container are
     * 	waiting for an update
     */
    private var _isLoading:Boolean;
    
    [Bindable]
    public function set isLoading(l:Boolean):void
    {
      _isLoading = l;
      
      invalidateDisplayList();
    }
    
    public function get isLoading():Boolean
    {
      return _isLoading;
    }
    
    /**
     * 	Source path/class for the loadImage
     */
    private var _loadImageSource:Object;
    
    [Bindable]
    public function set loadImageSource(obj:Object):void
    {
      _loadImageSource = obj;
      
      invalidateDisplayList();
    }
    
    public function get loadImageSource():Object
    {
      return _loadImageSource;
    }
    
    //--------------------------------------------------------------------------
    //
    //  Overridden methods
    //
    //--------------------------------------------------------------------------
    
    /**
     * 	Create the loadImage and fade graphic
     */
    protected override function createChildren():void
    {
      super.createChildren();
      
      if (!_loadImage)
      {
        _loadImage = new Image();
      }
      
      if (!_fade)
      {
        _fade = new UIComponent();
      }
    }
    
    /**
     * 	Update the size and position of the fade graphic and loadImage
     */
    protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
      super.updateDisplayList(unscaledWidth, unscaledHeight);
      
      // center the _loadImage
      if (_loadImage)
      {
        _loadImage.percentHeight = 100; // unscaledHeight;
        _loadImage.percentWidth = 100; // unscaledWidth;
        //_loadImage.x = unscaledWidth / 2 - _loadImage.width / 2;
        //_loadImage.y = unscaledHeight / 2 - _loadImage.height / 2;
      }
      
      if (_isLoading && _loadImageSource)
      {
        _loadImage.source = _loadImageSource;
        
        // add the fade and loadImage to the display list
        if (!this.contains(_fade))
          addChild(_fade);
        if (!this.contains(_loadImage))
          addChild(_loadImage);
        
        // fill the fade component with a translucent white
        //var g:Graphics = _fade.graphics;
        //g.clear();
        //g.beginFill(0xFFFFFF, .6);
        //g.drawRect(0, 0, unscaledWidth, unscaledHeight);
        //g.endFill();
      }
      else
      {
        _loadImage.source = null;
        
        // remove the fade and load image from the display list
        if (this.contains(_fade))
          removeChild(_fade);
        if (this.contains(_loadImage))
          removeChild(_loadImage);
      }
    }
  }
}